@import "common.scss";

// 基础样式
body {
  // user-select: none;
}

img {
  -webkit-user-drag: none;
}

#root,
.App,
.ant-layout {
  height: 100%;
}

a {
  text-decoration: none;
  color: $fontGray;
}

// 公共样式
.center {
  text-align: center;
}

.fr {
  float: right;
}

.fl {
  float: left;
}

// 首页布局样式
// :global {
.trigger {
  padding: 0 24px;
  font-size: 18px;
  line-height: 64px;
  cursor: pointer;
  transition: color 0.3s;
  color: #efefef !important;
}

.trigger {
  color: #3f9b6a !important;
}

// .trigger:hover {
//   color: #3f9b6a!important;
// }

// .logo {
//   float: left;
//   width: 120px;
//   height: 31px;
//   margin: 4px 24px 16px 0;
//   background: rgba(255, 255, 255, 0.3);
// }
.nav-logo {
  // float: left;
  width: 120px;
  height: 50px;
  line-height: 50px;
  background: #262f3e !important;
  border-bottom: 1px solid #344258;
}

.site-layout .site-layout-background {
  background: $white;
  position: fixed;
  top: 0;
}

.site-layout {
  // background-color: pink;
  height: calc(100vh - 50px); //减去头部

}

.ant-layout-content {
  overflow: scroll;
}

.ant-layout-header {
  display: flex;
  height: 50px !important;
  line-height: 50px !important;
  color: #fff;
  justify-content: space-between;
  background: #3f9b6a !important;
  border-bottom: 1px solid #3f9b6a;
  font-size: 12px;

  span {
    cursor: pointer;

    &:hover {
      color: #fff;
    }
  }

  .ant-avatar:hover,
  .ant-avatar span:hover {
    color: $white;
  }
}

.all-view {
  position: relative;
  margin: 0 40px 0 30px;

  &:after {
    position: absolute;
    content: '';
    right: -20px;
    top: 20px;
    height: 14px;
    width: 2px;
    background: $fontGray;
    opacity: 0.6;
  }
}

.ant-layout-sider {
  background: #fff !important;
  min-height: calc(100vh - 50px); //减去头部
}

.ant-layout-sider-children {
  min-height: calc(100vh - 50px); //减去头部
  background-color: #fff;
}

.sider-trgger {
  position: absolute;
  bottom: 0;
}

.ant-menu.ant-menu-dark,
.ant-menu-dark .ant-menu-sub,
.ant-menu.ant-menu-dark .ant-menu-sub {
  background: #1e222d !important;
}

.ant-menu-item-selected::after {
  display: none;
}

.ant-menu::-webkit-scrollbar {
  width: 0;
  background-color: transparent;
}

.ant-menu-inline .ant-menu-item,
.ant-menu-inline .ant-menu-submenu-title {
  width: 85%;
  overflow: hidden;
  border-radius: 10px;
  margin-left: 10px;
}

.ant-menu-item-selected {
  background-color: #3f9b6a !important;
  color: #fff;
}

.ant-menu-submenu-selected {
  color: #151822;
}

.ant-menu-submenu-title:hover {
  background-color: #f6f8f7;
  color: #3f9b6a !important;
}

/* 修改未选中状态下鼠标经过的样式 */
.ant-menu-item:not(.ant-menu-item-selected):hover {
  color: #3f9b6a;
  background-color: #f6f8f7;
  width: 85%;
  overflow: hidden;
  border-radius: 10px;
  margin-left: 10px;
}

/* 修改选中状态下鼠标经过的样式 */
.ant-menu-item-selected:not(.ant-menu-item-disabled):hover {
  color: #fff;
}

.ant-menu-item-selected:not(.ant-menu-item-disabled) .ant-menu-title-content {
  color: #fff;
}

.ant-menu-light .ant-menu-submenu-active {
  color: #151822;
}

.ant-menu-submenu-arrow::before,
.ant-menu-submenu-arrow::after {
  background-color: #151822;
}

.ant-menu-item:first-child {
  margin-top: 0.5px;
}

.ant-menu-scroll {
  display: none !important;
}

// } 
.title {
  margin-left: 30px;
  font-weight: bold;
  color: #efefef;
}

.head {
  height: 50px;
  line-height: 50px;
  font-size: 16px;
  margin-left: 12px;
  color: $white;
}

.ant-badge-count {
  box-shadow: none;
}

.nav-left {
  display: flex;
}

.nav-right {
  display: flex;
  align-items: center;
}

.search {
  width: 180px;
  height: 30px;
  line-height: 30px;
  margin-right: 20px;
  background: #344258;

  &:hover {
    background: #344258;
  }

  .ant-input {
    caret-color: #7c878e;

    &::placeholder {
      color: #4f636b !important;
    }
  }
}

.cloud-content {
  height: 545px;
  width: 1130px;
  overflow-y: auto;
  // max-height: 860px;
  // background: #151822;
  color: $fontGray;
}

.popover-box {
  position: relative;

  span {
    cursor: pointer;

    &:hover {
      color: $blue;
    }
  }
}

.popover {
  position: absolute;
  height: 570px;
  width: 1150px;
  top: 50px;
  left: -5px;
  overflow-y: auto;
  // max-height: 860px;
  background: #151822;
  color: $fontGray;
  z-index: 999;
}

.ant-dropdown-menu {
  background: #151822;
}

.ant-dropdown-menu-item,
.ant-dropdown-menu-submenu-title {
  color: $fontGray;
}

.ant-dropdown-menu-item:hover,
.ant-dropdown-menu-submenu-title:hover,
.ant-dropdown-menu-item.ant-dropdown-menu-item-active,
.ant-dropdown-menu-item.ant-dropdown-menu-submenu-title-active,
.ant-dropdown-menu-submenu-title.ant-dropdown-menu-item-active,
.ant-dropdown-menu-submenu-title.ant-dropdown-menu-submenu-title-active {
  background: $blue;
  color: $white;
}

.custom-modal-full {
  height: 100%;
  top: 0;
  padding: 0;

  .ant-modal {
    height: 100%;
    top: 0;
  }

  .ant-modal-content {
    height: 100%;
  }

  .ant-modal-body {
    height: calc(100% - 110px);
    overflow-y: auto;
  }
}

.table-btn-box {
  .ant-btn {
    padding: 0;
  }
}

// 滚动条样式
::-webkit-scrollbar {
  width: 8px;
  background: transparent;
  border-radius: 4px;
}

::-webkit-scrollbar-track {}

::-webkit-scrollbar-thumb {
  width: 8px;
  background: rgba(0, 0, 0, 0.3);
  border-radius: 4px;
  opacity: 0.5;
}

.ant-pagination-total-text {
  position: absolute;
  left: 0;
}

.detail_back {
  margin-bottom: 20px;
}

.ant-form-item-control-input-content {
  word-break: break-all;
}

.ant-btn-primary {
  background: #3f9B6a;
  border-color: #3f9B6a;

}

.ant-btn-primary:hover,
.ant-btn-primary:focus {
  background-color: #79BB98;
  border-color: #79BB98;
}

.ant-btn-link,
.ant-btn-link:focus {
  color: #3f9B6a;

  &:hover {
    color: #3f9B6a;
  }
}

.ant-btn-default:hover,
.ant-btn-default:focus {
  border-color: #3f9B6a;
  color: #3f9B6a;
}

.ant-input-number-focused,
.ant-input-number:hover {
  border-color: #3f9B6a;
  box-shadow: none;
}

.ant-input-affix-wrapper:not(.ant-input-affix-wrapper-disabled):hover,
.ant-input-affix-wrapper-focused {
  border: 1px solid #3f9B6a;
  z-index: 1;
  box-shadow: none;
}

.ant-picker-range:hover {
  border: 1px solid #3f9B6a;
}

.ant-picker-active-bar {
  border: 1px solid #3f9B6a;
}

.ant-picker-focused {
  border: 1px solid #3f9B6a;
  z-index: 1;
  box-shadow: none;
}

.ant-picker:hover,
.ant-picker-focused {
  border: 1px solid #3f9B6a;
}

.ant-picker-middle .ant-picker:hover {
  border: 1px solid #3f9B6a;
}

.ant-select:not(.ant-select-customize-input) .ant-select-selector:hover {
  border-color: #3f9B6a;
}

.ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector {
  border-color: #3f9B6a;
  box-shadow: none;
}

.ant-pagination-item-active,
.ant-pagination-item-active:hover {
  border-color: #3f9B6a;
}

.ant-pagination-item-active a,
.ant-pagination-item-active a:hover {
  color: #3f9B6a;
}

.ant-pagination-item a:hover {
  color: #3f9B6a;
}

.ant-pagination-options-quick-jumper input:hover {
  border-color: #3f9B6a;
  box-shadow: none;
}

.ant-pagination-options-quick-jumper input:focus {
  border-color: #3f9B6a;
  box-shadow: none;
}

.ant-pagination-next:hover .ant-pagination-item-link {
  color: #3f9B6a;
}

.ant-pagination.ant-pagination-mini:hover .ant-pagination-item:not(.ant-pagination-item-active):hover {
  color: #3f9B6a;
}

.ant-radio-button-wrapper,
.ant-radio-button-wrapper:hover {
  color: #3f9B6a;
}

.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled) {
  color: #3f9B6a;
  border-color: #3f9B6a !important;
  box-shadow: none !important;

  &:hover {
    color: #3f9B6a;
  }
}

.ant-table-container table>thead>tr:first-child th {
  background-color: #f2f3f5;
  color: #788396;
}

.ant-tabs-tab:hover {
  color: #3f9B6a;
}

.ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn {
  color: #3f9B6a;
}

.ant-tabs .ant-tabs-nav-wrap::before {
  border-color: #3f9B6a !important;
}

.ant-tabs-ink-bar {
  background: #3f9B6a;
}

.ant-input:hover,
.ant-input:focus {
  border-color: #3f9B6a !important;
  box-shadow: none;
}

.ant-modal-confirm-btns button:nth-child(2) {
  background-color: #3f9B6a;
}

//404的
.notFound {
  img {
    position: absolute;
    top: 80px;
    left: 240px;
    width: 400px;
    height: 350px;
  }

  .text {
    position: absolute;
    top: 180px;
    left: 640px;
    width: 400px;

    .sorry {
      font-size: 24px;
      font-weight: bold;
    }

    .textInfo {
      font-size: 14px;
      margin: 15px 0 25px;
      color: #606368;
    }

    .btns {
      display: flex;
      justify-content: space-between;
      width: 200px;

      button {
        background-color: #3f9B6a;
        color: #fff;
        border: none;
        padding: 5px 15px 5px;
        border-radius: 15px
      }
    }
  }
}

//高版本浏览器弹窗报错
.ant-modal div[aria-hidden="true"] {
  display: none !important;
}